import { useTodo } from '../../context/todo-list'

const List = () => {
  const {list} = useTodo();
  return (
    <ul
      style={{ width: 400 }}
    >
      {
        list.map((item, index) => (
          <li
            key={index}
            style={{
              display: 'flex',
              justifyContent: 'space-between',
              borderBottom: '1px solid #ccc'
            }}
          >
            <span>{item.title}</span>
            <span>{item.time}</span>
          </li>
        ))
      }
    </ul>
  )
}

export default List